<template>
  <div class="ch-content">
    <HomeNav class="ch-nav"></HomeNav>
    <div class="ch-container">
      <SideBar class="ch-sidebar"></SideBar>
    </div>
  </div>
</template>

<script lang="ts">
import {defineComponent, onMounted} from 'vue';
import HomeNav from '@/views/home/component/HomeNav.vue';
import {apiMethod} from '@/apis/apis';
import {useStore} from 'vuex';
import SideBar from '@/views/home/component/SideBar.vue';
export default defineComponent({
  name: 'Home',
  components: {SideBar, HomeNav},
  setup () {
    let store = useStore();
    let gainUserInfo = async () => {
      if (!store.getters['user/user']) {
        let res = await apiMethod.apiGetUserInfoByToken();
        await store.dispatch('user/asyncSetUser', res.result);
      }
    }
    let mounted = onMounted(async () => {
      await gainUserInfo();
    });
    return { gainUserInfo, mounted }
  }
});
</script>

<style lang="scss" scoped>
.ch-content{
  height: 100%;
  .ch-nav {
    height: 60px;
  }
  .ch-container {
    box-sizing: border-box;
    height: calc(100% - 80px);
    max-height: calc(100% - 80px);
    .ch-sidebar{
      margin: 10px;
    }
  }
}

</style>
